<script>
import Select from 'ant-design-vue/es/select'
export default {
    name:'ZkSelect',
    props:{
        value:{
            type:[String,Number,Boolean,Object],
            default:null
        },
        options:{
            type:[Array,Function],
            default:()=>[]
        },
        disabled:{
            type:Boolean,
            default:false
        },
        placeholder:{
            type:[String,Object]
        }
    },
    data() {
        return {
            optionsData: [{ label: '', value: 'null' }]
        }
    },
    watch:{
        // options(newVal,oldVal){
        //     console.log('options变化');
        //     if (newVal instanceof Array) {
        //         console.log('options变化');
        //     }
        // } 
    },
    created(){
        if (this.options instanceof Array) {
            this.optionsData = this.options;
        }else{
            this.options().then((result) => {
                this.optionsData = result;
            });
        }
    },
    render(){
        const props = Object.keys(this.$props).reduce((res,key) => {
            res[key] = this[key];
            return res;
        },{});

        props.value = formatVal(props.value);
        delete props.option;
        props.options = this.optionsData.map(i=>{
            i.value = formatVal(i.value);
            return i;
        });
        
        const onChange =(value, option)=>{
            if (value == 'null') { 
                value = null; 
            }
            this.$emit('input',value, option);
            this.$listeners.change&&this.$listeners.change();
        }
        return (
            <a-select {...{ props }} onChange={ onChange }></a-select> 
        )
    },
    methods:{
        refresh(){
            if (this.options instanceof Array) return Promise.resolve();
            return this.options().then((res) => {
                this.optionsData = res;
            });
        }
    }
}

function formatVal(value) {
    // 非 boolean
    if(typeof value!='boolean'||value!=null){
        return value = ''+value;
    }
    return value;
}
</script>